﻿<div id="myTab">
    <!-- 导航 -->
    <ul>
        <li class="active">
            <a href="#baseProp" data-toggle="tab">属性</a>
        </li>
        <li>
            <a href="#eventProp" data-toggle="tab">事件</a>
        </li>
    </ul>
    <!-- 内容 -->
    <form class="form-inline" role="form">
        <div id="baseProp">
            <div class="form-group">
                <label for="txtEName">英文名称：</label><input type="text" class="form-control" readonly="readonly" id="txtEName" />
            </div>
            <div class="form-group">
                <label for="txtUrl">图片路径：</label><input type="text" class="form-control" id="txtUrl" />
            </div>
            <div class="form-group">
                <label for="txtCName">选择样式：</label>
                <select id="selClass">
                    <option title="添加 border-radius:6px 来获得图片圆角" value="img-rounded">圆角</option>
                    <option title="添加 border-radius:500px 来让整个图片变成圆形" value="img-circle">圆形</option>
                    <option title="添加一些内边距（padding）和一个灰色的边框" value="img-thumbnail">灰色边框</option>
<!--                    <option title="让图片支持响应式设计, 图片将很好地扩展到父元素" value="img-responsive">响应式图片</option>                    -->
                </select>
            </div>
<!--            <div class="form-group">
                <label for="txtCName">选择大小：</label>
                <select id="selSize">
                    <option value="btn-large">较大</option>
                    <option value="btn-default">默认</option>
                    <option value="btn-small">较小</option>
                    <option value="btn-mini">很小</option>
                </select>
                <input type="checkbox" id="chkBlockBtn" title="横跨整个区域"/><label for="chkBlockBtn">块级按钮</label>
            </div>-->
        </div>
        <div id="eventProp">
            <div class="form-group">
                <label for="txtClickEvent">单击：</label>
                <input type="text" class="form-control" readonly="readonly" id="txtClickEvent" />
                <button type="button" class="btn btn-primary" onclick="btnClickEventConfig();">配置</button>
            </div>
            <div class="form-group">
                <label for="txtDBLClickEvent">双击：</label>
                <input type="text" class="form-control" readonly="readonly" id="txtDBLClickEvent" />
                <button type="button" class="btn btn-primary" id="btnDBLClickEvent">配置</button>
            </div>
            <div class="form-group">
                <label for="txtEnterEvent">进入：</label>
                <input type="text" class="form-control" readonly="readonly" id="txtEnterEvent" />
                <button type="button" class="btn btn-primary" id="btnEnterEvent">配置</button>
            </div>
            <div class="form-group">
                <label for="txtBlurEvent">离开：</label>
                <input type="text" class="form-control" readonly="readonly" id="txtBlurEvent" />
                <button type="button" class="btn btn-primary" id="btnBlurEvent">配置</button>
            </div>
            <div class="form-group">
                <label for="txtKeyUpEvent">按键：</label>
                <input type="text" class="form-control" readonly="readonly" id="txtKeyUpEvent" />
                <button type="button" class="btn btn-primary" id="btnKeyUpEvent">配置</button>
            </div>
        </div>
    </form>
</div>